<nz-card>
  <nz-form-item>
    <nz-form-label nzFlex="120px" nzRequired>商品名称</nz-form-label>
    <nz-form-control nzFlex="400px">
      <input nz-input placeholder="请输入商品编号或名称" maxlength="12" [(ngModel)]="form.name"/>
    </nz-form-control>
  </nz-form-item>

  <nz-form-item>
    <nz-form-label nzFlex="120px" nzRequired>商品分类</nz-form-label>
    <nz-form-control nzFlex="400px">
      <nz-select
        [(ngModel)]="form.typeList"
        nzPlaceHolder="请选择分类"
        nzMode="multiple">
        <nz-option
          *ngFor="let item of categoryOptions"
          [nzLabel]="item['name']"
          [nzValue]="item['id']">
        </nz-option>
      </nz-select>
    </nz-form-control>
  </nz-form-item>

  <nz-form-item>
    <nz-form-label nzFlex="120px" nzRequired>第三方商品ID</nz-form-label>
    <nz-form-control nzFlex="400px">
      <input nz-input placeholder="请输入第三方商品ID" maxlength="56" [(ngModel)]="form.pictureId"/>
    </nz-form-control>
  </nz-form-item>

  <nz-form-item>
    <nz-form-label nzFlex="120px" nzRequired>排序</nz-form-label>
    <nz-form-control nzFlex="400px">
      <input nz-input placeholder="请输入序号" type="number" [(ngModel)]="form.sort"/>
    </nz-form-control>
  </nz-form-item>

  <nz-form-item>
    <nz-form-label nzFlex="120px" nzRequired>适用材质</nz-form-label>
    <nz-form-control nzFlex="1">
      <nz-checkbox-group [(ngModel)]="textureOptions" (ngModelChange)="textureChange(textureOptions)"></nz-checkbox-group>
    </nz-form-control>
  </nz-form-item>

  <nz-form-item>
    <nz-form-label nzFlex="120px" nzRequired>商品图片</nz-form-label>
    <nz-form-control nzFlex="400px">
      <nz-upload
        class="avatar-uploader"
        [(nzFileList)]="goodsListImg.fileList"
        nzListType="picture-card"
        [nzShowUploadList]="false"
        nzAccept="image/*"
        [nzCustomRequest]="customRequest"
        (nzChange)="handleChange($event,goodsListImg)"
      >
        <ng-container *ngIf="!goodsListImg.url">
          <i class="upload-icon" nz-icon [nzType]="'plus'"></i>
        </ng-container>
        <img *ngIf="goodsListImg.url" [src]="goodsListImg.url" style="width: 100%;max-height: 128px"/>
      </nz-upload>
    </nz-form-control>
  </nz-form-item>
  <!--<nz-row>-->
  <!--  <div><span><span style="color: red">*</span>商品详情底图:</span></div>-->
  <!--  <nz-upload-->
  <!--    class="avatar-uploader"-->
  <!--    [(nzFileList)]="goodsDetailImg.fileList"-->
  <!--    nzListType="picture-card"-->
  <!--    [nzShowUploadList]="false"-->
  <!--    nzAccept="image/*"-->
  <!--    [nzCustomRequest]="customRequest"-->
  <!--    (nzChange)="handleChange($event,goodsDetailImg)"-->
  <!--  >-->
  <!--    <ng-container *ngIf="!goodsDetailImg.url">-->
  <!--      &lt;!&ndash;      <i class="upload-icon" nz-icon [nzType]="loading ? 'loading' : 'plus'"></i>&ndash;&gt;-->
  <!--      <i class="upload-icon" nz-icon [nzType]="'plus'"></i>-->
  <!--    </ng-container>-->
  <!--    <img *ngIf="goodsDetailImg.url" [src]="goodsDetailImg.url" style="width: 100%;max-height: 128px"/>-->
  <!--  </nz-upload>-->
  <!--</nz-row>-->
  <!--<nz-row>-->
  <!--  <div><span><span style="color: red">*</span>商品详情定制图:</span></div>-->
  <!--  <nz-upload-->
  <!--    class="avatar-uploader"-->
  <!--    [(nzFileList)]="goodsDetailCustomizationImg.fileList"-->
  <!--    nzListType="picture-card"-->
  <!--    [nzShowUploadList]="false"-->
  <!--    nzAccept="image/*"-->
  <!--    [nzCustomRequest]="customRequest"-->
  <!--    (nzChange)="handleChange($event,goodsDetailCustomizationImg)"-->
  <!--  >-->
  <!--    <ng-container *ngIf="!goodsDetailCustomizationImg.url">-->
  <!--      &lt;!&ndash;      <i class="upload-icon" nz-icon [nzType]="loading ? 'loading' : 'plus'"></i>&ndash;&gt;-->
  <!--      <i class="upload-icon" nz-icon [nzType]="'plus'"></i>-->
  <!--    </ng-container>-->
  <!--    <img *ngIf="goodsDetailCustomizationImg.url" [src]="goodsDetailCustomizationImg.url" style="width: 100%;max-height: 128px;"/>-->
  <!--  </nz-upload>-->
  <!--</nz-row>-->
</nz-card>

<nz-card class="m-t-2">
  <button nz-button nzType="primary" [nzLoading]="saveBtnLoading" (click)="save()">保存</button>
  <button nz-button nzType="default" class="m-l-8" (click)="bakc()">返回</button>
</nz-card>